<template>
  <div class="h-87" style="top:8.1%;height: 92%;">
    <!-- 高 636px  -->
    <div class="flex justify-between" style="height:48.29%">
      <div data-bottom class="second-sides">
        <page-header text="奶山羊企业投入产出比">
          <!-- <v-chart v-if="optionZscpzlzr.isShow" ref="zscpjzlzr" :options="optionZscpzlzr" /> -->
          <v-chart v-if="optionNSYtrccb_fxc.isShow" ref="zscpjzlzr" :options="optionNSYtrccb_fxc" />
        </page-header>
      </div>
      <div data-bottom class="second-sides">
        <page-header text="奶山羊企业收益分析">
          <!-- <v-chart v-if="optionCyrkqk.isShow" ref="nypx" :options="optionCyrkqk" /> -->
          <v-chart v-if="optionNSYqysyfx_fxc.isShow" ref="nypx" :options="optionNSYqysyfx_fxc" />
        </page-header>
      </div>
      <div data-bottom class="second-sides">
        <page-header text="奶山羊企业投入分析" :ph="800">
          <v-chart v-if="optionNSYqytrfx_fxc.isShow" :options="optionNSYqytrfx_fxc" />
        </page-header>
      </div>
    </div>
    <!-- 高 20px -->
    <div style="height:2.14%" />
    <!-- 高 607px -->
    <div class="flex justify-between" style="height:48.29%">
      <div data-bottom class="second-sides">
        <page-header :ph="800" text="奶山羊料奶比">
          <!-- <v-chart v-if="optionJscgjzlzrje.isShow" ref="zscpjzlzr" :options="optionJscgjzlzrje" /> -->
          <v-chart v-if="optionNSYlnb_fxc.isShow" ref="zscpjzlzr" :options="optionNSYlnb_fxc" />
        </page-header>
      </div>
      <div data-bottom class="second-sides">
        <page-header :ph="800" text="奶山羊产羔率">
          <v-chart v-if="optionNSYcgl_fxc.isShow" :options="optionNSYcgl_fxc" />
        </page-header>
      </div>
      <div data-bottom class="second-sides">
        <page-header text="奶山羊羔羊成活率" :ph="800">
          <v-chart :is-show="optionNSYgychl_fxc.isShow" :options="optionNSYgychl_fxc" />
        </page-header>
      </div>
    </div>
    <Particulars />
  </div>
</template>

<script>
  import { getTowSideStat, hotWords , getEchartsData , getEchartsDataS} from '@/api/connector'
  import Particulars from 'header/particulars.vue'
  import echarts from 'echarts'
  import { getHandle } from '@/api'
  import { formatNumber } from '@/utils/app'
  import { getDataAndRefresh } from '@/utils/echartsRefresh'
  import PageHeader from 'header/PageHeader.vue'
  import 'echarts-wordcloud'
  import YlTable from 'header/yltable'
  const tooltip = function (a, b) {
    return {
      trigger: 'axis',
      axisPointer: {
        type: 'shadow'
      },
      // formatter: '{b}<br />{a2}:{c2}%<br />{a1}:{c1}%<br />{a0}:{c0}%'
      formatter: function (params, ticket, callback) {
        var htmlStr = ''
        for (var i = 0; i < params.length; i++) {
          var param = params[i]
          var xName = param.name // x轴的名称
          var seriesName = param.seriesName // 图例名称
          var value = param.value[i + 1] // y轴值
          var color = param.color // 图例颜色
          if (i === 0) {
            htmlStr += xName + '<br/>' // x轴的名称
          }
          htmlStr += '<div>'
          htmlStr +=
            '<span style="margin-right:5px;display:inline-block;width:10px;height:10px;border-radius:5px;background-color:' + color + ';"></span>' // 一个点
          htmlStr += seriesName + '：奶山羊企业投入产出比 ' + value // 圆点后面显示的文本
          htmlStr += '</div>'
        }
        return htmlStr
      }
    }
  }
  export default {
    name: 'AgriculturalTechnology',
    components: { PageHeader, Particulars },
    data() {
      return {
        // spkart 奶山羊企业投入产出比 配置项
        optionNSYtrccb_fxc: {
          isShow: true,
          width: '88%',
          legend: {
            top: 0,
            right: 7,
            itemWidth: 10,
            itemHeight: 10,
            textStyle: {
              color: '#E9F7FF',
              fontWeight: 400,
              fontSize: 14
            },
          },
          grid: {
            bottom:'8%'
          },
          tooltip: tooltip(1, 2),
          dataset: {
            source: [
            ]
          },
          xAxis: {
            type: 'category',
            axisLine: {
              lineStyle: {
                color: '#5C6D7C'
              }
            },
          },
          yAxis: [
            {
              name: '%',
              nameTextStyle: {
                color: '#fff'
              },
              axisLine: {
                lineStyle: {
                  color: '#5C6D7C'
                }
              },
              splitLine: {
                show: true,
                lineStyle: {
                  color: '#5C6D7C'
                }
              },
              axisLabel: {
                color: '#E9F7FF',
                // fontWeight: 'bold',
                fontSize: 13
              }
            },
            {
              position: 'right',
              axisLine: {
                lineStyle: {
                  color: '#5C6D7C'
                }
              },
            }
          ],
          // Declare several bar series, each will be mapped
          // to a column of dataset.source by default.
          series: [
            {
              type: 'bar',
              barWidth: 10,
              itemStyle: {
                color: new echarts.graphic.LinearGradient(
                  0, 0, 0, 1,
                  [
                    { offset: 0, color: '#00DCFF' },
                    { offset: 1, color: 'rgba(0, 182, 255, 0)' }
                  ]
                )
              }
            },
            {
              type: 'bar',
              barWidth: 10,
              itemStyle: {
                color: new echarts.graphic.LinearGradient(
                  0, 0, 0, 1,
                  [
                    { offset: 0, color: '#9C52FF' },
                    { offset: 1, color: 'rgba(156, 82, 255, 0)' }
                  ]
                )
              }
            },
            {
              type: 'bar',
              barWidth: 10,
              itemStyle: {
                color: new echarts.graphic.LinearGradient(
                  0, 0, 0, 1,
                  [
                    { offset: 0, color: '#18D8B1' },
                    { offset: 1, color: 'rgba(24, 216, 177, 0)' }
                  ]
                )
              }
            }
          ]
        },
        // spkart 奶山羊企业收益分析 配置项
        optionNSYqysyfx_fxc: {
          isShow: true,
          legend: {
            top: '23%',
            right: 40,
            orient: 'vertical',
            itemGap: 24,
            textStyle: {
              color: '#E9F7FF',
              fontWeight: 400,
              fontSize: 14
            },
            itemWidth: 10,
            itemHeight: 10,
          },
          tooltip: {
            formatter: (params) => {
              var htmlStr11 = '',
                htmlStr11 = '&nbsp;&nbsp;' + params.name + ':' + params.percent + '%'
              return htmlStr11
            }
          },
          series: [
            {
              name: '奶山羊企业收益分析',
              type: 'pie',
              radius: [70, 120],
              center: ['40%', '53%'],
              roseType: 'radius',
              itemStyle: {
              },

              label: {
                alignTo: 'labelLine',
                padding: [0, -75],
                formatter: ' {b} \n\n',
                color: '#fff',
                fontWeight: 600,
                fontSize: 15
              },
              labelLine: {
                length2: 70,
              },
              data: [
              ]
            }
          ]
        },
        // spkart 奶山羊企业投入分析 配置项
        optionNSYqytrfx_fxc: {
          isShow: true,
          legend: {
            top: '23%',
            right: 40,
            orient: 'vertical',
            itemGap: 24,
            textStyle: {
              color: '#E9F7FF',
              fontWeight: 400,
              fontSize: 14
            },
            itemWidth: 10,
            itemHeight: 10,
          },
          tooltip: {
            formatter: (params) => {
              var htmlStr11 = '',
                htmlStr11 = '&nbsp;&nbsp;' + params.name + ':' + params.percent + '%'
              return htmlStr11
            }
          },
          series: [
            {
              name: 'Nightingale Chart',
              type: 'pie',
              radius: [70, 120],
              center: ['40%', '53%'],
              roseType: 'radius',
              itemStyle: {
                borderRadius: 8
              },

              label: {
                alignTo: 'labelLine',
                padding: [0, -75],
                formatter: ' {b} \n\n',
                color: '#fff',
                fontWeight: 600,
                fontSize: 15
              },
              labelLine: {
                length2: 80,
              },
              data: [
              ]
            }
          ]
        },
        // spkart 奶山羊料奶比  配置项
        optionNSYlnb_fxc: {
          isShow: true,
          tooltip: {},
          radar: {
            center: ['50%', '58%'],
            // 标签配置
            name: {
              color: '#E9F7FF',
              fontWeight: 500,
              lineHeight: 20,
              fontSize: 14,
              padding: [5, 12],
              backgroundColor: 'rgba(21, 83, 121, .5)'
            },
            nameGap: 10,
            // 坐标轴配置
            // axisLine: {
            //   show: true
            // },
            splitArea: {
              show: true,
              areaStyle: {
                color: ['#2A3936', '#495853', '#2A3936', '#495853', 'transparent']
              }
            },
            // shape: 'circle',
            indicator: [
              { name: '万只羊场', max: 800 , },
              { name: '千只羊场', max: 800 },
              { name: '适度规模羊场', max: 800 },
              { name: '家庭牧场', max: 800 },
              { name: '养殖户', max: 800 },
            ],
          },
          series: [
            {
              type: 'radar',
              data: [
                {
                  value: [],
                  name: '奶山羊料奶比:'
                }
              ],
              lineStyle: {
                color: '#CFBD21'
              },
              areaStyle: {
                color: '',
                opacity: 0
              },
            }
          ]
        },
        // spkart 奶山羊产羔率  配置项
        optionNSYcgl_fxc: {
          isShow: true,
          legend: {
            top: 0,
            right: '2%',
            itemWidth: 14,
            textStyle: {
              color: '#E9F7FF',
              fontWeight: 400,
              fontSize: 14
            },
          },
          tooltip: {
            trigger: 'axis'
          },
          grid: {
            left: '3%',
            right: '3%',
            bottom: '3%',
            containLabel: true,
          },
          xAxis: {
            type: 'category',
            data: [],
            boundaryGap: false,
            axisLine: {
              lineStyle: {
                color: '#5C6D7C'
              }
            },
          },
          yAxis: [
            {
              type: 'value',
              name: '%',
              nameTextStyle: {
                color: '#fff'
              },
              axisLine: {
                lineStyle: {
                  color: '#5C6D7C'
                }
              },
              splitLine: {
                show: true,
                lineStyle: {
                  color: '#5C6D7C'
                }
              },
            },

            {
              position: 'right',
              axisLine: {
                lineStyle: {
                  color: '#5C6D7C'
                }
              },
            }
          ],
          series: [
            {
              name: '全国',
              type: 'line',
              data: [],
              smooth: false,
              symbol: 'emptyCircle',
              symbolSize: [8, 8],
              itemStyle: {
                color: '#3CB5FF'
              }
            },
            {
              name: '陕西',
              type: 'line',
              data: [],
              smooth: false,
              symbol: 'emptyCircle',
              symbolSize: [8, 8],
              itemStyle: {
                color: '#18D8B1'
              }
            },
            {
              name: '陇县',
              type: 'line',
              data: [],
              smooth: false,
              symbol: 'emptyCircle',
              symbolSize: [8, 8],
              itemStyle: {
                color: '#6647FF'
              }
            },
          ]
        },
        // spkart 奶山羊羔羊成活率  配置项
        optionNSYgychl_fxc: {
          isShow: true,
          legend: {
            data: ['全国', '陕西', '陇县'],
            top: 0,
            right: '2%',
            itemWidth: 14,
            textStyle: {
              color: '#E9F7FF',
              fontWeight: 400,
              fontSize: 14
            },
          },
          tooltip: {
            trigger: 'axis'
          },
          grid: {
            left: '3%',
            right: '3%',
            bottom: '3%',
            containLabel: true,
          },
          xAxis: {
            type: 'category',
            data: [],
            boundaryGap: false,
            axisLine: {
              lineStyle: {
                color: '#5C6D7C'
              }
            },
          },
          yAxis: [
            {
              type: 'value',
              name: '%',
              nameTextStyle: {
                color: '#fff'
              },
              axisLine: {
                lineStyle: {
                  color: '#5C6D7C'
                }
              },
              splitLine: {
                show: true,
                lineStyle: {
                  color: '#5C6D7C'
                }
              },
            },

            {
              position: 'right',
              axisLine: {
                lineStyle: {
                  color: '#5C6D7C'
                }
              },
            }
          ],
          series: [
            {
              name: '全国',
              type: 'line',
              data: [],
              smooth: false,
              symbol: 'emptyCircle',
              symbolSize: [8, 8],
              itemStyle: {
                color: '#3CB5FF'
              }
            },
            {
              name: '陕西',
              type: 'line',
              data: [],
              smooth: false,
              symbol: 'emptyCircle',
              symbolSize: [8, 8],
              itemStyle: {
                color: '#18D8B1'
              }
            },
            {
              name: '陇县',
              type: 'line',
              data: [],
              smooth: false,
              symbol: 'emptyCircle',
              symbolSize: [8, 8],
              itemStyle: {
                color: '#6647FF'
              }
            },
          ]
        },

        optionCyrkqk: {
          isShow: false,
          tooltip: tooltip('场次', '人次'),
          legend: {
            textStyle: {
              color: '#fff'
            },
            data: ['可用余额', '不可用余额', '收入', '支出']
          },
          grid: {
            left: '3%',
            right: '4%',
            bottom: '10%',
            top: '16%',
            containLabel: true
          },
          xAxis: {
            type: 'category',
            axisLine: {
              lineStyle: {
                color: '#E9F7FF',
                width: 1
              }
            },
            data: []
          },
          yAxis: [
            {
              name: '场次',
              axisLine: {
                lineStyle: {
                  color: '#E9F7FF',
                  width: 1
                }
              },
              splitLine: {
                // 分割线配置
                lineStyle: {
                  color: '#ffffff'
                }
              }
            },
            {
              name: '人次',
              axisLine: {
                lineStyle: {
                  color: '#E9F7FF',
                  width: 1
                }
              },
              splitLine: {
                // 分割线配置
                lineStyle: {
                  color: '#ffffff'
                }
              }
            }
          ],
          series: []
        },
        optionZjfuqk: {
          isShow: false,
          tooltip: {
            trigger: 'axis',
            axisPointer: {
              type: 'line'
            },
            // formatter: '{b}<br />{a2}:{c2}%<br />{a1}:{c1}%<br />{a0}:{c0}%'
            formatter: function (params, ticket, callback) {
              var htmlStr = ''
              for (var i = 0; i < params.length; i++) {
                var param = params[i]
                var xName = param.name // x轴的名称
                var seriesName = param.seriesName // 图例名称
                var value = param.value // y轴值
                var color = param.color // 图例颜色
                if (i === 0) {
                  htmlStr += xName + '<br/>' // x轴的名称
                }
                htmlStr += '<div>'
                htmlStr +=
                  '<span style="margin-right:5px;display:inline-block;width:10px;height:10px;border-radius:5px;background-color:' + color + ';"></span>' // 一个点
                htmlStr += seriesName + '：' + formatNumber(value) + '次' // 圆点后面显示的文本
                htmlStr += '</div>'
              }
              return htmlStr
            }
          },
          legend: {
            data: ['邮件营销', '联盟广告', '视频广告', '直接访问', '搜索引擎']
          },
          grid: {
            left: '3%',
            right: '4%',
            bottom: '10%',
            top: '16%',
            containLabel: true
          },
          xAxis: [
            {
              type: 'category',
              boundaryGap: false,
              axisLine: {
                lineStyle: {
                  color: '#E9F7FF',
                  width: 1
                }
              },
              data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
            }
          ],
          yAxis: [
            {
              name: '次',
              type: 'value',
              axisLine: {
                lineStyle: {
                  color: '#E9F7FF',
                  width: 1
                }
              },
            }
          ],
          series: [
            {
              name: '邮件营销',
              type: 'line',
              areaStyle: {},
              data: [120, 132, 101, 134, 90, 230, 210]
            },
            {
              name: '联盟广告',
              type: 'line',
              areaStyle: {},
              data: [220, 182, 191, 234, 290, 330, 310]
            },
            {
              name: '视频广告',
              type: 'line',
              areaStyle: {},
              data: [150, 232, 201, 154, 190, 330, 410]
            }
          ]
        },
        hotWordsList: {
          isShow: false,
          tooltip: {
            show: true,
            position: 'top',
            textStyle: {
              fontSize: 30
            }
          },
          series: [
            {
              type: 'wordCloud',
              // 网格大小，各项之间间距
              gridSize: 30,
              // 形状 circle 圆，cardioid  心， diamond 菱形，
              // triangle-forward 、triangle 三角，star五角星
              shape: 'line',
              // 字体大小范围
              sizeRange: [14, 60],
              // 文字旋转角度范围
              rotationRange: [0, 0],
              // 旋转步值
              rotationStep: 0,
              // 自定义图形
              // maskImage: maskImage,
              left: 'center',
              top: 'center',
              right: null,
              bottom: null,
              // 画布宽
              width: '90%',
              // 画布高
              height: '100%',
              // 是否渲染超出画布的文字
              drawOutOfBound: false,
              textStyle: {
                normal: {
                  color: function () {
                    return (
                      'rgb(' +
                      [Math.round(Math.random() * 200 + 55), Math.round(Math.random() * 200 + 55), Math.round(Math.random() * 200 + 55)].join(',') +
                      ')'
                    )
                  }
                },
                emphasis: {
                  shadowBlur: 10,
                  shadowColor: '#2ac'
                }
              },
              data: []
            }
          ]
        },
        optionZZFBXX: {
          isShow: false,
          tooltip: {
            trigger: 'axis',
            axisPointer: {
              type: 'shadow'
            },
            formatter: '{b}<br>{a}:{c}个'
          },
          legend: {
            data: []
          },
          grid: {
            left: '3%',
            right: '4%',
            bottom: '10%',
            top: '16%',
            containLabel: true
          },
          xAxis: {
            type: 'category',
            data: [],
            axisPointer: {
              type: 'line'
            },
            axisLine: {
              lineStyle: {
                color: '#E9F7FF',
                width: 1
              }
            },
          },
          yAxis: {
            type: 'value',
            name: '个',
            axisLine: {
              lineStyle: {
                color: '#E9F7FF',
                width: 1
              }
            },
          },
          series: [
            {
              name: '',
              type: 'line',
              areaStyle: {},
              data: []
            }

          ]
          // isShow: false,
          // title: {
          //   //   text: '农产品劳动力需求分析'
          // },
          // tooltip: {
          //   trigger: 'axis',
          //   axisPointer: {
          //     type: 'shadow'
          //   },
          //   // formatter: '{b}<br />{a2}:{c2}%<br />{a1}:{c1}%<br />{a0}:{c0}%'
          //   formatter: function(params, ticket, callback) {
          //     var htmlStr = ''
          //     for (var i = 0; i < params.length; i++) {
          //       var param = params[i]
          //       var xName = param.name // x轴的名称
          //       var seriesName = param.seriesName // 图例名称
          //       var value = param.value // y轴值
          //       var color = param.color // 图例颜色
          //       if (i === 0) {
          //         htmlStr += xName + '<br/>' // x轴的名称
          //       }
          //       htmlStr += '<div>'
          //       htmlStr +=
          //         '<span style="margin-right:5px;display:inline-block;width:10px;height:10px;border-radius:5px;background-color:' + color + ';"></span>' // 一个点
          //       htmlStr += seriesName + '：' + formatNumber(value) + '个' // 圆点后面显示的文本
          //       htmlStr += '</div>'
          //     }
          //     return htmlStr
          //   }
          // },
          // legend: {},
          // grid: {
          //   left: '3%',
          //   right: '4%',
          //   bottom: '3%',
          //   containLabel: true
          // },
          // toolbox: {},
          // xAxis: {
          //   type: 'category',
          //   boundaryGap: false, // 坐标轴两边留白
          //   data: [],
          //   axisTick: {
          //     // 坐标轴刻度相关设置。
          //     show: false
          //   },
          //   splitLine: {
          //     // 坐标轴在 grid 区域中的分隔线。
          //     show: false,
          //     lineStyle: {
          //       color: '#E5E9ED'
          //       // 	opacity:0.1
          //     }
          //   }
          // },
          // yAxis: [
          //   {
          //     type: 'value',
          //     name: '个',
          //     splitNumber: 5
          //   }
          // ],
          // series: [
          //   {
          //     name: '',
          //     type: 'line',
          //     smooth: true,
          //     itemStyle: {
          //       normal: {
          //         color: '#3A84FF',
          //         lineStyle: {
          //           color: '#3A84FF',
          //           width: 1
          //         },
          //         areaStyle: {
          //           color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
          //             {
          //               offset: 0,
          //               color: 'rgba(58,132,255,0)'
          //             },
          //             {
          //               offset: 1,
          //               color: 'rgba(58,132,255,0.35)'
          //             }
          //           ])
          //         }
          //       }
          //     },
          //     data: []
          //   }
          // ]
        },
        optionJscgjzlzrje: {
          isShow: false,
          tooltip: {
            trigger: 'axis',
            axisPointer: {
              type: 'shadow'
            },
            formatter: '{b}<br>{a}:{c}亿元'
          },
          legend: {
            data: ['蒸发量', '降水量', '平均温度']
          },
          grid: {
            left: '3%',
            right: '4%',
            bottom: '10%',
            top: '16%',
            containLabel: true
          },
          xAxis: {
            type: 'category',
            data: [],
            axisPointer: {
              type: 'line'
            },
            axisLine: {
              lineStyle: {
                color: '#E9F7FF',
                width: 1
              }
            },
          },
          yAxis: {
            type: 'value',
            name: '亿元',
            axisLine: {
              lineStyle: {
                color: '#E9F7FF',
                width: 1
              }
            },
          },
          series: []
        },
        optionZscpzlzr: {
          isShow: false,
          tooltip: tooltip('个', '个'),
          legend: {
            data: ['蒸发量', '降水量', '平均温度']
          },
          grid: {
            left: '3%',
            right: '4%',
            bottom: '10%',
            top: '16%',
            containLabel: true
          },
          xAxis: {
            type: 'category',
            data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
            axisPointer: {
              type: 'shadow'
            },
            axisLine: {
              lineStyle: {
                color: '#E9F7FF',
                width: 1
              }
            },
          },
          yAxis: {
            type: 'value',
            name: '个',
            axisLine: {
              lineStyle: {
                color: '#E9F7FF',
                width: 1
              }
            },
          },
          series: []
        },
        table: {
          url: '/cybd/api/agri/agriTechPrize/queryList',
          columns: [
            {
              prop: 'firstAchieveUnit',
              label: '第一完成单位'
            },
            {
              prop: 'achieveMen',
              label: '完成人'
            }
          ]
        },
        table_2: {
          url: '/cybd/api/agri/policy/queryList',
          columns: [
            {
              prop: 'policyName',
              label: '政策名称'
            },
            {
              prop: 'publishUnit',
              label: '发布机构'
            },
            {
              prop: 'source',
              label: '来源'
            }
          ]
        },
      
        // 定时器
        timer1: null,
        timer2: null,
        timer3: null,
        timer5: null,
        timer6: null,
      }
    },
    created() {
      // spkart 请求图表数据
      this.timer1 = getDataAndRefresh(this.getEchartsData01)
      this.timer2 = getDataAndRefresh(this.getEchartsData02)
      this.timer3 = getDataAndRefresh(this.getEchartsData03)
      this.getEchartsData04()
      this.timer5 = getDataAndRefresh(this.getEchartsData05)
      this.timer6 = getDataAndRefresh(this.getEchartsData06)
    },
    destroyed() {
      clearInterval(this.timer1)
      clearInterval(this.timer2)
      clearInterval(this.timer3)
      clearInterval(this.timer5)
      clearInterval(this.timer6)
    },
    methods: {
      // spkart 奶山羊企业投入产出比
      getEchartsData01() {
        this.optionNSYtrccb_fxc.dataset.source = []
        getEchartsData('DATA_TYPE_NSY_INPUT_OUTPUT_RATIO').then(res => {
          this.formatData01(res.data.rows)
        }).catch(err => {
          console.log(err);
        })
      },
      formatData01(rows) {
        var names = ['product', '全国', '陕西', '陇县']
        var Data = []
        rows.forEach(item => {
          Data.push([
            item.dataDateStr, item.c_1, item.c_2, item.c_3
          ])
        })
        Data.reverse().unshift(names)
        this.optionNSYtrccb_fxc.dataset.source = Data
        // var timer = null
        // timer == null ? '': clearInterval(timer)
        // setInterval(() => {
        //   console.log(1);
        //   this.optionNSYtrccb_fxc.dataset.source = []
        //   this.optionNSYtrccb_fxc.dataset.source = Data
        // }, 2000);
      },
      // spkart 奶山羊企业收益分析
      getEchartsData02() {
        this.optionNSYqysyfx_fxc.series[0].data = []
        getEchartsData('DATA_TYPE_NSY_ENTERPRISE_INCOME', 1, 1).then(res => {
          this.formatData02(res.data.rows)
          // console.log(res);
        }).catch(err => {
          console.log(err);
        })
      },
      formatData02(rows) {
        var names = ['羊奶销售', '种羊销售', '青年羊销售', '羔羊销售', '淘汰羊销售', '羊粪销售', '其他']
        var Data = []
        Data = [
          { value: rows[0].c_1, name: names[0] },
          { value: rows[0].c_2, name: names[1] },
          { value: rows[0].c_3, name: names[2] },
          { value: rows[0].c_4, name: names[3] },
          { value: rows[0].c_5, name: names[4] },
          { value: rows[0].c_6, name: names[5] },
          { value: rows[0].c_7, name: names[6] }
        ]
        this.optionNSYqysyfx_fxc.series[0].data = Data
      },
      // spkart 奶山羊企业投入分析
      getEchartsData03() {
        this.optionNSYqytrfx_fxc.series[0].data = []
        getEchartsData('DATA_TYPE_NSY_ENTERPRISE_INVESTMENT', 1, 1).then(res => {
          this.formatData03(res.data.rows)
        }).catch(err => {
          console.log(err);
        })
      },
      formatData03(rows) {
          var names = ['种羊引进', '饲料费用', '兽药费用', '人工费用', '折旧费用', '维修费用', '其他费用']
          var Data = []
          Data = [
            { value: rows[0].c_1, name: names[0] },
            { value: rows[0].c_2, name: names[1] },
            { value: rows[0].c_3, name: names[2] },
            { value: rows[0].c_4, name: names[3] },
            { value: rows[0].c_5, name: names[4] },
            { value: rows[0].c_6, name: names[5] },
            { value: rows[0].c_7, name: names[6] }
          ]
          this.optionNSYqytrfx_fxc.series[0].data = Data
        },
      // spkart 奶山羊料奶比
      getEchartsData04() {
        getEchartsData('DATA_TYPE_NSY_ENTERPRISE_FEED_MILK_RATIO', 1, 1).then(res => {
          this.formatData04(res.data.rows)
        }).catch(err => {
          console.log(err);
        })
      },
      formatData04(rows) {
        var yData = [rows[0].c_1, rows[0].c_2, rows[0].c_3, rows[0].c_4, rows[0].c_5]
        let max = Math.max(...yData)
        this.optionNSYlnb_fxc.radar.indicator.forEach(item => {
          item.max = max
        })
        this.optionNSYlnb_fxc.series[0].data[0].value = yData
      },
      // spkart 奶山羊产羔率
      getEchartsData05() {
        this.optionNSYcgl_fxc.xAxis.data = []
        this.optionNSYcgl_fxc.series[0].data = []
        this.optionNSYcgl_fxc.series[1].data = []
        this.optionNSYcgl_fxc.series[2].data = []
        getEchartsData('DATA_TYPE_NSY_LAMBING_RATE').then(res => {
          this.formatData05(res.data.rows)
          // console.log(res.data.rows);
        }).catch(err => {
          console.log(err);
        })
      },
      formatData05(rows) {
        // c1  -   c3  全国  陕西  陇县 
        var xData = []
        var yData01 = []
        var yData02 = []
        var yData03 = []

        rows.forEach(item => {
          xData.push(item.dataDateStr)
          yData01.push(item.c_1)  
          yData02.push(item.c_2)  
          yData03.push(item.c_3)  
        })
        this.optionNSYcgl_fxc.xAxis.data = xData.reverse()
        this.optionNSYcgl_fxc.series[0].data = yData01.reverse()
        this.optionNSYcgl_fxc.series[1].data = yData02.reverse()
        this.optionNSYcgl_fxc.series[2].data = yData03.reverse()
      },
      // spkart 奶山羊羔羊成活率
      getEchartsData06() {
        this.optionNSYgychl_fxc.xAxis.data = []
        this.optionNSYgychl_fxc.series[0].data = []
        this.optionNSYgychl_fxc.series[1].data = []
        this.optionNSYgychl_fxc.series[2].data = []
        getEchartsData('DATA_TYPE_NSY_LAMBING_LIVE_RATE').then(res => {
          this.formatData06(res.data.rows)
        }).catch(err => {
          console.log(err);
        })
      },
      formatData06(rows) {
        // c1  -   c3  全国  陕西  陇县 
        var xData = []
        var yData01 = []
        var yData02 = []
        var yData03 = []

        rows.forEach(item => {
          xData.push(item.dataDateStr)
          yData01.push(item.c_1)
          yData02.push(item.c_2)
          yData03.push(item.c_3)
        })
        this.optionNSYgychl_fxc.xAxis.data = xData.reverse()
        this.optionNSYgychl_fxc.series[0].data = yData01.reverse()
        this.optionNSYgychl_fxc.series[1].data = yData02.reverse()
        this.optionNSYgychl_fxc.series[2].data = yData03.reverse()
      },
      
      toFour(name, isCodew, typeCode) {
        if (name === isCodew) {
          this.$router.push({ name: 'Fourstage', query: { code: '000204', name: this.$route.matched[0].name, typeCode: typeCode || isCodew } })
        }
      },
      init() {
        getTowSideStat({ groupCode: 'NYPX' }).then((data) => {
          const val = data.body
          // console.log('val', val)
          const optionCyrkqk = this.optionCyrkqk
          optionCyrkqk.xAxis.data = val.dateSet
          optionCyrkqk.legend.data = val.typeSet
          const arr = Object.keys(val.typeValueListMap)
          arr.forEach((item, index) => {
            optionCyrkqk.series.push({
              name: item,
              type: 'bar',
              data: val.typeValueListMap[item],
              yAxisIndex: index
            })
          })
          optionCyrkqk.isShow = true
          this.toLink(this, 'nypx', (p) => {
            this.toFour(p.seriesName, '参培人数', '农业培训人数')
            this.toFour(p.seriesName, '培训次数', '农业培训场次')
          })
        })
        getTowSideStat({ groupCode: 'ZJFWQK' }).then((res) => {
          this.optionZjfuqk.xAxis[0].data = res.body.dateSet
          this.optionZjfuqk.legend.data = res.body.typeSet
          var obj = res.body.typeValueListMap
          var key = []
          var value = []
          for (var i in obj) {
            key.push(i)
            value.push(obj[i])
          }
          this.optionZjfuqk.series[0].data = value[0]
          this.optionZjfuqk.series[0].name = key[0]
          this.optionZjfuqk.series[1].data = value[1]
          this.optionZjfuqk.series[1].name = key[1]
          this.optionZjfuqk.series[2].data = value[2]
          this.optionZjfuqk.series[2].name = key[2]
          this.optionZjfuqk.isShow = true
        })
        hotWords({ type: 'NYTP' }).then((res) => {
          this.hotWordsList.series[0].data = res.body.data.map((item, index) => {
            return {
              name: item.name,
              value: item.number
            }
          })
          this.hotWordsList.isShow = true
        })

        // 农业政策
        getTowSideStat({ groupCode: 'ZZFBXX' }).then((res) => {
          const val = res.body
          this.optionZZFBXX.xAxis.data = val.dateSet
          this.optionZZFBXX.series[0].name = '政策发布数量'
          this.optionZZFBXX.series[0].data = val.typeValueListMap['政策发布数量']
          this.optionZZFBXX.isShow = true
        })
        getTowSideStat({ groupCode: 'ZSCPJZLZR' }).then((data) => {
          const val = data.body
          const option = this.optionZscpzlzr
          const optionJscgjzlzrje = this.optionJscgjzlzrje
          optionJscgjzlzrje.xAxis.data = option.xAxis.data = val.dateSet
          optionJscgjzlzrje.legend.data = option.legend.data = val.typeSet
          Object.keys(val.typeValueListMap).forEach((item, index) => {
            if (item.indexOf('金额') === -1) {
              option.series.push({
                name: item,
                type: 'bar',
                data: val.typeValueListMap[item]
              })
            } else {
              optionJscgjzlzrje.series.push({
                name: item,
                type: 'line',
                areaStyle: {},
                data: val.typeValueListMap[item]
              })
            }
          })
          option.isShow = true
          optionJscgjzlzrje.isShow = true
          this.toLink(this, 'zscpjzlzr', (p) => {
            console.log(p)
            this.toFour(p.seriesName, '涉农技术专利转让数量', '品种种植涉农专利转让数')
            this.toFour(p.seriesName, '涉农科技成果转让数量', '农业科技成果转让数')
          })
        })
      }
    }
  }
</script>

<style lang="scss" scoped>
  .second-center {
    width: 47.87%;
    height: 100%;
    background-size: 100% 100% !important;
  }

  .second-sides {
    width: 32.7%;
    height: 100%;
    background-size: 100% 100% !important;
  }

  .second-center[data-top] {
    background: url(~@/assets/img/gradients-right.png) no-repeat;
  }

  .second-center[data-bottom] {
    background: url(~@/assets/img/gradients-right.png) no-repeat;
  }

  .second-sides[data-top] {
    background: url(~@/assets/img/gradients-right.png) no-repeat;
  }

  .second-sides[data-bottom] {
    background: url(~@/assets/img/gradients-right.png) no-repeat;
  }

  .el-table {
    background-color: transparent !important;
  }
</style>